import { Menu, message } from 'antd';
import { useNavigate, useLocation, Outlet } from 'react-router-dom';
import { menuList } from './config';
import styles from './App.module.scss';

message.config({ maxCount: 1 });

const Nav = () => {
    const navigate = useNavigate();
    const location = useLocation();

    return (
      <div className={styles.container}>
        <Menu
            mode="inline"
            onClick={(info) => {
              navigate(info.key);
            }}
            items={menuList}
            style={{ width: 256 }}
            selectedKeys={[location.pathname]}
        />
        <div className={styles.rightMainBox}>
          <Outlet />
        </div>
      </div>
    );
}

export default Nav;
